<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>帮助</title>

    <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css"/>


</head>
<body>
  <div id="app" style="padding-top:60px" v-cloak>
    <div id="blank" class="header shopheader" v-cloak>
        <div v-back.tapmode class="getback"></div>
        <span class="title">添加商品</span>
        <span v-back.tapmode   style="position:absolute;right:10px;font-size:14px;" v-myclick="addgoods" v-show="index>0">保存({{index}})</span>
    </div>
    <div style="width:100%;background:white;height:45px;z-index:1000;position:fixed;top:60px">
      <div style="width:95%;margin:0 auto;margin-top:5px">
      <div class="search"  style="background:#f0f0f0;;border-radius:4px;font-size:14px" tapmode>
          <img class="search-image" src="../../image/big/search_btn_grey.png"/ style="margin-left:10px;margin-top:5px;width: 20px;height: 20px;float: left;">
          <input placeholder="您想找什么"  onkeyup="searchgoods()" id="keyword" onfocus="onkeep()" >
      </div>
      <!-- <img class="icon-search" v-src="'../../image/search_btn_grey.png'" tapmode onclick="searchgoods(1)"> -->
      <span style="margin-top:13px;font-size:14px;color:#333;margin-left:10px" tapmode onclick="searchgoods(1)">搜索</span>
    </div>
    </div>
    <div class="search-container" id="search-container">
        <div class="hot-search">
            <div class="hot-top">
                <span>热门搜索</span>
            </div>
            <div class="hot-body">
                <div class="hot-padding" v-for="hotWord in hotWords">
                    <span v-myclick="[hotWord, selectHotWord]">{{hotWord}}</span>
                </div>
            </div>
        </div>
        <div class="history-search">
            <div class="history-top">
                <span>搜索历史</span>
                <img src="../../image/delete.png " v-myclick="deleteAll"/>
            </div>
            <div class="history-body">
                <div class="history-one" v-show="!list.length">
                    <span>还没有任何搜索历史</span>
                </div>
                <div class="history-one" v-for="(item ,index) in list">
                    <div class="history-padding" v-myclick="[item, selectHisWord]">
                        <img class="img1" src="../../image/clock.png"/>
                        <span>{{item}}</span>
                        <img class="img2" src="../../image/shanchu.png" v-myclick.stop="[index, deleteTodo]"/>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="condition " style="background: white;top:100px;" v-cloak v-show="isSearch">
        <ul style="margin-top:10px">
            <li v-myclick="[0, changeStatus]" :class="{'active': 0===isActive}">
                <a class="li-click">综合排序</a>
            </li>
            <li v-myclick="[1, changeStatus]" :class="{'active': 1===isActive}">
                <a class="li-click ">销量</a>
            </li>
            <li v-myclick="[2, changeStatus]" :class="{'active': 2===isActive}">
                <a class="li-click " tapmode>价格</a>
                <img style="width: 14px;height: 14px;" v-show="isActive!=2" v-src="'../../image/tab_default_img.png'"/>
                <img style="width: 14px;height: 14px;" v-show="isPrice&&isActive===2"
                     v-src="'../../image/tab_to_des.png'"/>
                <img style="width: 14px;height: 14px;" v-show="!isPrice&&isActive===2"
                     v-src="'../../image/tab_to_asc.png'"/>
            </li>
            <li v-myclick="[3, changeStatus]" :class="{'active': 3===isActive}">
                <a class="li-click">收入比率</a>
            </li>
        </ul>
    </div>
    <div style="padding-top:90px">
    <div class="goods_info" v-for="(good, index) in goods" v-if="goods.length > 0">
      <div class="goods-detail" v-myclick="[good, opebrowser]" >
        <div class="goods-pic">
          <img v-image-resize="{src:'http:'+good.pictUrl}" :key="key">
        </div>
        <div class="goods-detail-right">
          <div class="goods-detail-title" :key="key">{{(good.title).replace(/<[^>]+>/g,"")}}</div>
          <div class="sell-price" >
            <div style="float:left;"><span style="color:#666666;" :key="key">原价：</span><span style="color:#9d0152">￥{{good.reservePrice}}</span></div>
            <div style="float:left;padding-left:10px"><span style="color:#666666;" :key="key">优惠价格：</span><span style="color:#9d0152">￥{{good.couponAmount}}</span></div>
            <div style="clear:both"></div>
          </div>
          <div class="goods_number" @click.stop="selectStatus(good)">
            <span style="color:#E5001E">赚：{{(good.zkPrice*good.tkRate*gain_rate.t6_gain_rate_max/100).toFixed(2)}}</span>
            <span style="padding-left:20px">销量：{{good.biz30day}}</span>
            <img class="goods-radio"  @click.stop="selectStatus(good)" v-src="'../../image/unselected.png'" v-show="good.select !== 1">
            <img class="goods-confirm" @click.stop="selectStatus(good)" v-src="'../../image/selected.png'" v-show="good.select == 1">
          </div>
        </div>
      </div>
    </div>
  </div>
  <alilazy-load  v-if="goods.length > 0" style="background-color:#f7f7f7;margin:10px 0;"
             count-per-page="20"
             :arr="goods"
             :url="url"
             >
  </alilazy-load>
  </div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/components.js"></script>
<script>

    var vm,
        moreActive,
        list,
        keyword,
        hotWords,
        goodsselected=[],
        arrlength,
        gain_rate,
        index=0,
        goods;
    apiready = function () {
      UIScrollPicture = api.require('UIScrollPicture');
      MNActionButton = api.require('PIActionButton');
      wx = api.require('wx');
      setBSImg();
      hotWords = JSON.parse(getPrefs("hotWords"));
      list = $api.getStorage('search_message');
      if (!list) {
          list = new Array();
      }
      var data = {
          member_id: getPrefs('member_id')
      };
      var callback = function (ret) {
          gain_rate = ret.content;
          max_count_add_per_day = gain_rate.max_count_add_per_day;
          max_count_in_shop = gain_rate.max_count_in_shop;
          left_count_add_per_day = gain_rate.left_count_add_per_day;
          left_count_in_shop = gain_rate.left_count_in_shop;
          initApp();
          addListeners();
          api.parseTapmode();
      };
      pinet.post(URL.getMemberRate, data, callback);
      addListeners();
    };
    function initApp() {
        vm = new Vue({
            el: "#app",
            data: {
                moreActive: 1,
                isselected:1,
                index:index,
                max_count_add_per_day: max_count_add_per_day,
                max_count_in_shop : max_count_in_shop,
                goods: '',
                url:'',
                arrlength:20,
                list: list,
                hotWords: hotWords,
                todo: "",
                isPrice: true,
                isSale: true,
                words: '',
                gain_rate:gain_rate,
                isActive: 0,
                sourceurl:'',
                key: 0,
                isSearch: false
            },
            watch: {
                'words': {
                    handler: function (newValue, oldValue) {
                        if (!newValue) {
                            this.isSearch = false;
                        } else {
                            this.isSearch = true;
                        }
                    }
                }
            },
            methods: {
                moremanage: function (index) {
                  this.moreActive = index;
                },
                selectStatus: function (good) {
                  if(good.select == 1){
                    good.select = -1;
                    index = (index-1);
                    vm.index = index;
                    goodsselected.remove(good);
                  }else{
                    index = (index+1);
                    if(index>left_count_add_per_day){
                      pinet.alert("亲，每日最多只能添加"+max_count_add_per_day+"个商品");
                      return;
                    }
                    if(index>left_count_in_shop){
                      pinet.alert("亲，您最多只能添加"+max_count_in_shop+"个商品");
                      return;
                    }
                    good.select = 1;
                    vm.index = index;
                    goodsselected.push(good);
                  }
                },
                addgoods:function(){
                  if(index>max_count_add_per_day){
                    pinet.alert('今日最多还能添加'+max_count_add_per_day+"个商品");
                    return;
                  }
                  if(index>max_count_in_shop){
                    pinet.alert('最多还能添加'+max_count_in_shop+"个商品");
                    return;
                  }
                  var data = {
                      member_id: getPrefs('member_id'),
                      goodsselected: JSON.stringify(goodsselected),
                  };
                  var callback = function (ret) {
                    if(ret.errcode==0){
                      openWin('shoplibrary');
                    }
                  };
                  pinet.post(URL.addGoods, data, callback);
                },
                changeStatus: function (index) {
                    showProgress();
                    this.isActive = index;
                    if(index==0){
                      this.url = this.sourceurl;
                    }
                    if(index==1){
                      this.url = this.sourceurl+'&sortType=9&queryType=0';
                    }
                    if(index == 2){
                    this.isPrice = !this.isPrice;
                      if (this.isPrice) {
                          this.url = this.sourceurl+'&sortType=3&queryType=0';
                      } else {
                          this.url = this.sourceurl+'&sortType=4&queryType=0';
                      }
                    }
                    if(index==3){
                      this.url = this.sourceurl+'&sortType=1&queryType=0';
                    }
                    pinet.get(this.url+"&perPageSize=20", function (result) {
                        aligoods = result.data.pageList;
                        vm.key++;
                        vm.goods = aligoods;
                        vm.isSearch = true;
                    });
                },
                opebrowser:function(good){
                  openWin('shopbrowser',{auctionurl:good.auctionUrl,good:good})
                },
                selectHotWord:function (item) {
                    document.getElementById("keyword").value = item;
                    searchgoods(1);
                },
                selectHisWord: function (item) {
                    document.getElementById("keyword").value = item;
                    searchgoods(1);
                },
                deleteTodo: function (index) {
                    this.list.splice(index, 1);
                    var key = "search_message";
                    $api.setStorage(key, list);
                },
                deleteAll: function () {
                    this.list = [];
                    var key = "search_message";
                    $api.setStorage(key, []);
                }
            },
        });
    }

    function addListeners() {
        api.addEventListener({
            name: 'searchKeyword'
        }, function () {
            vm.hotWords = JSON.parse(getPrefs("hotWords"));
            vm.list = $api.getStorage('search_message');
        });

        api.addEventListener({
            name: 'addlibrary'
        }, function () {
          vm.goods = '';
          index = 0;
          vm.index=0;
          vm.goodsselected=[];
          onkeep();
        });

        api.addEventListener({
            name: 'viewappear'
        }, function () {
            onPageStart();
        });

        api.addEventListener({
            name: 'viewdisappear'
        }, function (ret, err) {
            onPageEnd();
        });

        api.addEventListener({
            name: 'keyback'
        }, function (ret, err) {
            onPageEnd();
            api.closeWin();
        });
    }

    function searchgoods(obj) {
      var keyword = document.getElementById("keyword").value;

      if (!keyword) {
          pinet.alert("请输入要搜索的内容");
          return;
      }
      var locallist = $api.getStorage('search_message');
      if (!locallist) {
          locallist = new Array();
      }
      pinet.get('http://101.37.174.165:8082/api/SearchAlimamaProduct?keywords='+keyword, function (data) {
          var alurl = data.data.url;
          url = decodeURI(alurl);
          vm.url = url;
          vm.sourceurl = url,
          vm.goods = [];
          pinet.get(url+"&perPageSize=20", function (result) {
              aligoods = result.data.pageList;
              for(var i=0;i<aligoods.length;i++){
                aligoods[i].select = '-1';
              }
              document.getElementById('search-container').style.display = 'none';
              vm.goods = aligoods;
              vm.isSearch = true;
              index=0;
              vm.index=0;
              vm.goodsselected=[];
              if(obj==1){
                getLocalList(locallist, keyword);
              }
          });
      });
}
 function onkeep(){
    var obj = document.getElementById('search-container').style.display='block';
 }
 function getLocalList(list, val) {
    if (val) {
        Array.prototype.indexOf = function (val) {
            for (var i = 0; i < this.length; i++) {
                if (this[i] == val) {
                    return i;
                }
            }
            return -1;
        };
        Array.prototype.remove = function (val) {
            var index = this.indexOf(val);
            if (index > -1) {
                this.splice(index, 1);
                this.unshift(val);
            }
            if (index == -1) {
                this.unshift(val);
            }
        };
        list.remove(val);
        if (list.length > 10) {
            list.splice(10, 1);
        }
        var key = "search_message";
        $api.setStorage(key, list);
        api.sendEvent({
            name: 'searchKeyword'
        });
    }
}

</script>
</html>
